import React, { useState } from 'react';
import styled from 'styled-components';
import { View, TouchableOpacity, Text } from 'react-native';

const Rankingtabs = ({ title, color, clicked, currentTab, style }) => {
  console.log('135484687', title, color, clicked, currentTab);

  return (
    <View>
      <Container
        onPress={() => {
          currentTab(title);
          clicked();
        }}
        style={style}>
        <RankingtabsText style={{ color: color }}>{title}</RankingtabsText>
      </Container>
    </View>
  );
};
const RankingtabsText = styled.Text`
  color: purple;
  font-size: 20;
  margin-left: 15;
  margin-right: 15;
`;
const Container = styled(TouchableOpacity)`
  flex: 1;
  justify-content: center;
  align-items: center;
  background-color: white;
  border-color: purple;
`;
const Title = styled.Text`
  font-size: 14;
`;

export default Rankingtabs;
